<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作业</title>
    <style type="text/css">
.box{
    width: 520px;
    height: 690px;
    padding-left: 20px;
    background-color: rgb(244, 237, 237);
}
.title{
    padding-top: 20px;
}
h1{
  display: inline;  
}
.img{
    position: relative;
    background-position: top right;
    left: 120px;
    top: -35px;
   
}
.img img:hover{
    border-radius: 25px;
    background-image: url(images/arrow3.png),url(images/arrow1.png) ;
}
.title1{
    width: 200px;
    margin-right: 0;
    font-size: large;
    padding-left: 20px;
    padding-top: 30px;
    display: block;
}
.number{
    margin-top: 30px;
    margin-left: 20px;
    width: 200px;
    color: rgb(139, 133, 133);
    display: inline;
}

.model{
    margin-top: 30px;
    margin-left: 20px;
    font-size: large;
    display: block;
    width: 55px;
    height: 28px;
    text-align: center;
    border-radius: 2px;
    color: red;
    border: 1px solid red;
} 


.box1{
    width: 500px;
    height: 260px;
    background-color: rgba(246, 209, 209, 0.648);
    margin-bottom: 15px;
}
.box2{
    width: 500px;
    height: 260px;
    background-color: rgba(172, 213, 242, 0.647);
}
 .img1{
    position: relative;
    top: -145px;
    left: 250px;    
}
 .img2{
    position: relative;
    top: -145px;
    left: 250px;    
}
    </style>
</head>
<body>
    <div class="box">
        <div class="title"><h1>逛好店</h1>
            <div class="img"><img src="../images/arrow.png" alt=""></div>
        </div>
        
        <div class="box1">
        <div>
            <p class="title1">贝恩施京东自营官方<br>旗舰店</p>
            <p class="model">自营</p>
            <p class="number">227.9万人关注</p>
        </div>
            <div class="img1"><img src="../images/1.jpg" alt=""></div>
            
        </div>
        <div class="box2">
                <div>
                    <p class="title1">美宝莲京东自营官方<br>旗舰店</p>
                    <p class="model">自营</p>
                    <p class="number">192.9.9万人关注</p>
                </div>
            <div class="img2"><img src="../images/2.jpg" alt=""></div>
            
        </div>
        </div>
        
        </body>
        </html>
</body>
</html>